<!--
 * @FileDescription: 员工用户主界面
 * @Author: 叶永鸿、袁年政
 * @Date: 2021-7-17
 * @LastEditors: 叶永鸿
 * @LastEditTime: 2021-7-18
 -->
<template>
  <div class="emMain">
    <el-container class="el_emMain">
      <el-header class="backimg">
          <div>
          <el-col :span="1" :offset="3">
            <img src="../assets/img/logo.png" class='logo_png1'>
          </el-col>
          <el-col :span="6" :offset="1" :pull="1.5">
            <h1>企业跨组织人才管理系统</h1>
          </el-col>
          <el-col :span="1" :offset="8">
            <img src="../assets/img/jiaran1.png" class='logo_png2'>
          </el-col>
          </div>
        <el-dropdown>
          <i class="el-icon-setting" style="margin-right: 15px"></i>
          <template #dropdown>
            <el-dropdown-menu>
              <!-- <el-dropdown-item>查看</el-dropdown-item>
              <el-dropdown-item>新增</el-dropdown-item> -->
              <el-dropdown-item @click="logOut">退出登录</el-dropdown-item>
              <el-dropdown-item @click="toPulic">进入广场</el-dropdown-item>
            </el-dropdown-menu>
          </template>
        </el-dropdown>
        <span>{{ userName }}</span>
      </el-header>
      <el-container>
        <el-aside class="left" width="200px">
          <leftEmp></leftEmp>
        </el-aside>
        <el-main class="mid" width="200px">
          <router-view></router-view>
        </el-main>
      </el-container>
    </el-container>
  </div>
</template>



<script>
import leftEmp from "../components/leftEmp.vue";

export default {
  name: "emMain",
  data() {
    return {
      userName: this.$store.state.loginInfor.userName,
    };
  },
  methods: {
    logOut() {
      this.$store.commit("login", {
        userName: "",
        station: 0,
        token: "",
      });
      this.$router.push("/login");
    },
    toPulic(){
      this.$router.push("/public")
    }
  },
  components: { leftEmp },
};
</script>

<style scoped>
.el_emMain {
  height: 100%;
  background-color: #f3f3f3;
}
.head {
  background-color: burlywood;
}
.mid {
  background-color: #f9fafa;
}
.emMain {
  height: 100%;
}
.logo_png1{
 height: 60px;

}
.logo_png2{
  height: 75px;
}
.backimg{
  height: 60px;
  width: 100%;
 background: url(../assets/img/top.jpeg);
 background-size: 100% 100%;
}
.text{
  bottom: 200px;
}
</style>
